import { createRouter, createWebHistory } from 'vue-router'
import LandingPage from '../components/LandingPage.vue'
import LoginPage from '../views/LoginPage.vue' // 新建页面组件
import RegisterPage from '../views/RegisterPage.vue' // 新建页面组件
import ChatPage from '../views/ChatPage.vue' // 新建页面组件
import { useAuth } from '../composables/useAuth' // 导入 useAuth

const routes = [
  {
    path: '/',
    name: 'Landing',
    component: LandingPage,
    meta: { requiresAuth: false } // 首页不需要认证
  },
  {
    path: '/login',
    name: 'Login',
    component: LoginPage,
    meta: { requiresAuth: false, guestOnly: true } // 仅限未登录用户访问
  },
  {
    path: '/register',
    name: 'Register',
    component: RegisterPage,
    meta: { requiresAuth: false, guestOnly: true } // 仅限未登录用户访问
  },
  {
    path: '/chat',
    name: 'Chat',
    component: ChatPage,
    meta: { requiresAuth: true } // 聊天页面需要认证
  },
  // 可以添加一个 404 页面或重定向
  { path: '/:pathMatch(.*)*', redirect: '/' }
]

const router = createRouter({
  history: createWebHistory(),
  routes
})

// 全局前置守卫
router.beforeEach((to, from, next) => {
  // 注意：直接在守卫外部调用 useAuth 可能无法获取最新的响应式状态
  // 更好的方式是在 App.vue 中监听认证状态变化并处理重定向，
  // 或者在这里每次都创建一个临时的 useAuth 实例来检查 localStorage
  const token = localStorage.getItem('authToken');
  const isAuthenticated = !!token; // 简化检查

  if (to.meta.requiresAuth && !isAuthenticated) {
    // 需要认证但未登录，重定向到登录页
    next({ name: 'Login', query: { redirect: to.fullPath } }); // 保存原始目标路径
  } else if (to.meta.guestOnly && isAuthenticated) {
    // 仅限访客访问但已登录，重定向到聊天页
    next({ name: 'Chat' });
  } else {
    // 其他情况正常放行
    next();
  }
});

export default router